<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" type="text/css" href="css/base.css"/>
    <link rel="stylesheet" type="text/css" href="css/glitch-slideshow.css"/>
    <script>document.documentElement.className = "js";
    var supportsCssVars = function () {
        var e, t = document.createElement("style");
        return t.innerHTML = "root: { --tmp-var: bold; }", document.head.appendChild(t), e = !!(window.CSS && window.CSS.supports && window.CSS.supports("font-weight", "var(--tmp-var)")), t.parentNode.removeChild(t), e
    };
    supportsCssVars() || alert("Please view this demo in a modern browser that supports CSS Variables.");</script>
</head>
<body class="">
    <div class="content">
        <div class="slides slides--contained effect-2 ">
			            <div class="slide slide--current">
			                <div class="slide__img glitch" style="background-image: url(img/gun.png);"></div>
			                <div class="slide__text">
			                    <h2 class="slide__title">Broken Glow</h2>
			                    <p class="slide__description">Using the CSS Glitch Effect to
			                        transition between images of a slideshow.</p>
			                </div>
			            </div>
			            <div class="slide">
			                <div class="slide__img glitch" style="background-image: url(img/gun1.png);"></div>
			                <div class="slide__text">
			                    <h2 class="slide__title">Morning Dew</h2>
			                    <p class="slide__description">You have learn to bury your guilt with anger. I will teach you to
			                        confront it and to face the truth.</p>
			                </div>
			            </div>
			            <div class="slide">
			                <div class="slide__img glitch" style="background-image: url(img/gun2.png);"></div>
			                <div class="slide__text">
			                    <h2 class="slide__title">Crystal Way</h2>
			                    <p class="slide__description">I just the took to calling it the Bat. And yes Mr. Wayne, it does come
			                        in black.</p>
			                </div>
			            </div>
			            <div class="slide">
			                <div class="slide__img glitch" style="background-image: url(img/gun3.png);"></div>
			                <div class="slide__text">
			                    <h2 class="slide__title">Fine Quest</h2>
			                    <p class="slide__description">You have nothing, nothing to threaten me with. Nothing to do with all
			                        your strength.</p>
			                </div>
			            </div>
			            <div class="slide">
			                <div class="slide__img glitch" style="background-image: url(img/gun4.png);"></div>
			                <div class="slide__text">
			                    <h2 class="slide__title">Dome Being</h2>
			                    <p class="slide__description">I'll be standing where l belong. Between you and the people of
			                        Gotham.</p>
			                </div>
			            </div>
			        </div>
        <nav class="slide-nav">
            <button class="slide-nav__button"><span>上一页</span></button>
            <button class="slide-nav__button"><span>下一页</span></button>
        </nav>
    </div>
<script src="js/imagesloaded.pkgd.min.js"></script>
<script src="js/demo.js"></script>
<script src="js/demo2.js"></script>
</body>
</html>